<!DOCTYPE HTML>
<html> 
<head>
<script language="javascript">
function draw() {  
    var ctx = document.getElementById('myCanvas').getContext('2d');  
    // 创建用于图案的新image对象。
    var img = new Image();
    img.src = 'images/icon.jpg';
    img.onload = function(){
    // 创建图案。  
    var ptrn = ctx.createPattern(img,'repeat');
    ctx.fillStyle = ptrn;
    ctx.fillRect(0,0,600,600);
    }
}  
window.onload=function(){
    draw();
}
</script>
</head>
<body>
<canvas id="myCanvas" width="600" height="300"></canvas>
</body>
</html>
